<!-- 菜单树 -->
<template>
<div>
  <el-table
    :data="list"
    style="width: 100%;margin-bottom: 20px;"
    row-key="id"
    border
    default-expand-all
    :tree-props="{children: 'children', hasChildren: 'hasChildren'}">
    <el-table-column
      prop="permissionName"
      label="权限名称"
      width="300px">
    </el-table-column>
    <el-table-column
      prop="url"
      label="权限路由"
      width="240px">
    </el-table-column>
    <el-table-column
      prop="roleNames"
      label="权限对应角色名称">
    </el-table-column>
    <el-table-column
      prop="adminUsernames"
      label="拥有该权限的管理员">
    </el-table-column>

    <el-table-column v-if="this.roleId == 0" label="操作" width="350px" align="center">
      <template slot-scope="scope">
        <router-link :to="'/permission/save/'+scope.row.id">
        <el-button type="primary" size="mini">为其添加子权限</el-button>
        </router-link>
        <router-link :to="'/permission/update/'+scope.row.id">
        <el-button type="success" size="mini" >修改权限</el-button>
        </router-link>
        <el-button type="danger"  size="mini"  @click="deletePermission(scope.row.id)">删除</el-button>
      </template>
    </el-table-column>
  </el-table>
</div>
</template>
<script>
    import permission from'@/api/permission/permission'
  export default {
    data() {
      return {
        list:[],
        roleId:0
        }
    },
    created() {
      if(this.$route.params && this.$route.params.id){
       //添加操作
       this.roleId=this.$route.params.id,
       this.getRolePermission(this.$route.params.id)
       }else{
         this.getAllPermissions()
       }
    },

    watch:{
      $route(to, from) {
        this.roleId=0
        this.getAllPermissions()
    }
    },
    methods: {
      //获取全部权限列表
      getAllPermissions(){
        permission.getAllPermissions()
        .then(response=>{
          this.list=response.data.list
        })
      },
      //获取角色权限列表
      getRolePermission(roleId){
        permission.getRolePermission(roleId)
        .then(response=>{
          this.list=response.data.list
        })
      },
      //删除权限
     deletePermission(permissionId){
       permission.deletePermissionById(permissionId)
       .then(response=>{
         this.$message({
           type: 'success',
           message: '删除成功!'
         });
         this.getAllPermissions()
       })
     }
    }
  }
</script>
